<!DOCTYPE html>
<html lang="en" style="height:100%">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>我的职位</title>

    <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/yzl.css"/>

</head>
<body style="height:100%;background-color:#fff">
<div id="blank" class="header">
    <div v-back.tapmode class="back"></div>
    <span class="title">我的职位</span>
</div>
<div id="app" class="top-container" v-cloak>
    <div style="margin:25px 10px;font-size:20px;font-weight:bold">当前职位</div>
    <div class="user-card" style="padding-bottom:20px;" :style="userCard">
        <div class="user-card-top">
            <a>
                <img :src="user.portrait ? user.portrait : '../../image/portrait_moren.png'">
                <span>{{user.nickname}}</span>
            </a>
        </div>
        <div class="user-card-bottom">
            <div>
                <!-- <a>
                    <span>{{user.is_level_active == '0' ? user.disabled_name : user.name}}</span>
                </a> -->
            </div>
            <div>
              <div>
              <span>{{user.is_level_active == '0' ? user.disabled_name : user.level_name}}</span>
              <span v-if="user.is_level_active != '0'">有效期至 {{user.duration_type == 1 && user.date_level_end ? user.date_level_end : '永久'| date2}}</span>
              <span v-if="user.is_level_active = '0'">已失效，请重新激活</span>
            </div>
              <a v-myclick.stop="activate" :class="BSImg" v-if="user.is_level_active == '0'" >激活职位</a>
            </div>
        </div>
    </div>
    <div v-myclick="openLevel_up" class="btn-commit" :class="{disabled:user.can_update == 0}" style="margin-top:60px;">我要升级</div>
</div>
</body>
<script src="../../script/api.js"></script>
<script src="../../script/vue.js"></script>
<script src="../../script/app.js"></script>
<script src="../../script/common.js"></script>
<script src="../../script/url.js"></script>
<script>

    var user;
    var vm;
    apiready = function () {
        setBSImg();
        new Vue({
            el: '#blank'
        });
        showProgress();
        var data = {
            member_id: getPrefs('member_id')
        };
        var callback = function (ret) {
            user = ret.content;
            initApp();
            api.parseTapmode();
        };
        pinet.post(URL.getLevelInfo, data, callback);

        addListeners();
    };

    function initApp() {
        vm = new Vue({
            el: '#app',
            data: {
                user: user,
                imgPath:'../../image/',
                BSImg: {
                    big: Vue.BSImg == 'big',
                    small: Vue.BSImg == 'small'
                },
            },
            computed:{
                memberStyle:function () {
                    return getMemberStyle(this.user.level_id);
                },
                level_bg: function () {
                    return this.imgPath + this.memberStyle.level_bg
                },
                userCard: function () {
                    return {
                        backgroundImage:'url(' + this.imgPath + Vue.BSImg + '/' + this.memberStyle.level_bg +')',
                        color:this.memberStyle.color
                    }
                },
            },
            methods:{
                openLevel_up:function () {
                    if(this.user.can_update == 0){
                        return;
                    }
                    openWin('level_up');
                },
                activate: function () {
                    onEvent('激活按钮点击');
                    openWin('activate');
                },
            }
        });
    }

    function addListeners() {
        api.addEventListener({
            name: 'viewappear'
        }, function () {
            onPageStart();
        });

        api.addEventListener({
            name: 'viewdisappear'
        }, function () {
            onPageEnd();
        });

        api.addEventListener({
            name: 'keyback'
        }, function () {
            onPageEnd();
            api.closeWin();
        });
    }

</script>
</html>
